<template>
  <div class="cs-page-container">
    <div class="cs-filter-result">
      <el-table
        v-loading="listLoading"
        :data="list"
        :height="'calc(100vh - 250px)'"
        border
        fit
        size="small"
        highlight-current-row
        element-loading-text="拼命加载中"
        element-loading-spinner="el-icon-loading"
      >
        <el-table-column align="center" label="渠道名" prop="text">
        </el-table-column>
        <el-table-column align="center" label="是否显示" prop="status">
          <template slot-scope="{ row }">{{
            row.status === 0 ? '隐藏': '显示'
            }}</template>
        </el-table-column>
        <el-table-column
          align="center"
          label="操作"
          fixed="right"
          width="80"
        >
          <template slot-scope="{row}">
            <el-button
              type="primary"
              size="mini"
              @click="onEdit(row)"
            >{{row.status === 0 ? '显示': '隐藏'}}</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
  import { xhrChannelItem, xhrChannelChange } from '@/api/analysis'
  export default {
    name: "propSetting",
    data() {
      return {
        dialogVisible: false,
        formData: {
          label: null,
          parent: null,
          onShow: null
        },
        list: [],
        types: [],
        typeItems: {}
      }
    },
    created() {
      this.doSearch()
    },
    methods: {
      doSearch() {
        xhrChannelItem({}).then(resp => {
          this.list = resp.data
        }).catch(resp => {
          console.log(resp)
        })
      },
      onEdit(row){
        console.log(row)
        xhrChannelChange({text: row.text, status: row.status === 0 ? 1: 0 }).then(resp =>{
          console.log(resp)
          this.$message.success("请求成功")
          this.dialogVisible = false
          this.doSearch()
        }).catch(resp => {
          console.log(resp)
          this.$message.success(resp)
        })
      }
    }
  }
</script>

<style scoped>

</style>
